<!DOCTYPE=html>
<html>

<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <link href="css/css.css" rel="stylesheet" type="text/css" >
    <script type="text/javascript">  

        var strAddr = new Array();
        var NameArray = new Array();
        var ObjArray = new Array();
        //滚动事件监听
        function EvenFunt() {

            //给页面绑定滑轮滚动事件  

            //滚动滑轮触发scrollFunc方法  
            window.onmousewheel = document.onmousewheel = getScrollTop;


            for (var i = 132; i >= 0; i--) {
                strAddr[i] = "Image/" + i + ".jpg";
                NameArray[i] = "店家" + i;
                ObjArray[i] = "物品" + i;
            };
            getScrollTop();
        }

        function CHileN(N) {
            alert("点击物品" + N);
        }

        var NowShow = 0;
        function getScrollTop() {
            var ScrollPos;
            if (window.pageYOffset) {
                ScrollPos = window.pageYOffset;
            } else if (document.compatMode && document.compatMode != 'BackCompat') {
                ScrollPos = document.documentElement.scrollTop;
            } else if (document.body) {
                ScrollPos = document.body.scrollTop;
            }
            var WindowHeight = parseInt(getWinHeight());
            var DomHeight = parseInt(document.getElementById('Conticed').style.height);


            while (getWinHeight() + ScrollPos > DomHeight - 200 && NowShow < strAddr.length) {

                document.getElementById('Conticed').style.height = DomHeight + 100;
                DomHeight = parseInt(document.getElementById('Conticed').style.height);
                document.getElementById('Conticed').innerHTML += getContion(NowShow);
                NowShow++;
            }
        }

        function getContion(A) {
            var Dom = "";
            Dom += "<a href='' onclick='CHileN(" + A + ")'>"
            Dom += "<div style=' padding-top: 10px; padding-left:30px; border:0px;border-top-width:1px; border-color:#000; border-style:solid; padding-bottom: 1px; height:88;'>"

            Dom += "<img style ='float:left;' src='" + strAddr[A] + "'>"
            Dom += "<div style='width:150px; float:left;'>"
            Dom += "<p style ='width:100px; left:10px; '>" + NameArray[A] + "</p>"
            Dom += "<p style ='width:100px; left:10px; '>" + ObjArray[A] + "</p>"
            Dom += "</div>"
            Dom += "</div>"
            //Dom+="</a>"
            console.log("%s\n", Dom);
            return Dom;
        }

        // 获取窗口高度
        function getWinHeight() {
            if (window.innerHeight)
                return window.innerHeight;
            else if ((document.body) && (document.body.clientHeight))
                return document.body.clientHeight;
        }
    </script>

</head>

<body onload="EvenFunt()">
<div class="nav">
 <ul>
   <li><a href="#">首页</a></li>
   <li><a href="#">菜单</a></li>
   <li><a href="#">商家</a></li>
   <li><a href="#">赞助</a></li>
   <li><a href="#">详情</a></li>

 </ul>
</div>
    <div id="Conticed" style='border:1px; height:0;'>

    </div>

</body>

</html>